<%@page	import="com.trw.trp.util.*"%>
<%@ page language="java" pageEncoding="UTF-8"%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="extjs/ext-all.js.gzjs"></script>
<script type="text/javascript" src="extjs/thirdpart/JSON.js"></script>
<script type="text/javascript" src="js/trp.js"></script>
<link href="extjs/resources/css/ext-all.css" rel="stylesheet"
	type="text/css" />
<link href="css/trp.css" rel="stylesheet" type="text/css" />

<title>Login</title>
<style type="text/css">  
#BodyBg{ 
    width: 100%;  
    height: 100%;  
    position: absolute;  
    left: 0px;  
    top: 0px;  
    z-index: -1; 
} 
 
.stretch { 
    width:100%; 
    height:100%; 
} 
</style>
</head>
<body>
<div id="BodyBg"> 
   
</div>
<%
if(TRPUtil.getFromSession(TRPConstants.CURRENT_USER)!=null){
	response.sendRedirect("userProfile.action");
}
String orgUrl = (String)session.getAttribute("GOING_TO");
%>
<table align="center" cellpadding="0" cellspacing="0" height="100%" width="100%" border="0">
	<tr><td align="right" width="80%"><font size="6">上海天合汽车有限公司</font></td><td align="right"><img width="170" src="images/logo.png"/> </td></tr>
	<tr height="100%">
		<td colspan=2>
			<table align="center" cellpadding="0" cellspacing="0" height="100%" width="100%" border="0">
				<tr>
					<td width="100"><hr><td width=500><font size="6">Welcome to Test Request Platform</font></td><td><hr></td>
					<!--td width=20%><td><font size="16">My Test App</font></td-->
				</tr>
				<tr>
					<td colspan=3>
						<table cellpadding="0" cellspacing="0" height="100%" width="100%" border="0">
							<tr height=100>
								<td width="40%"></td>
								<td height=10>
									<div id="errorDiv"></div>
									<div id="successDiv"></div>
								</td>
								<td width="40%"></td>
							</tr>
							<tr valign="top">
								<td></td>
								<td><div id="logindiv"></div></td>
								<td></td>
							</tr>
						</table>
					</td>
				</tr>
			</table>
		</td>
	</tr>
</table>
<script type="text/javascript">
Ext.require([
	'Ext.form.*',
	'Ext.layout.container.Column',
	'Ext.tab.Panel'
]);

Ext.onReady(function(){

    Ext.QuickTips.init();
    var login,register,regForm,forgotPwdForm,forgotPwdWindow;

	if(!forgotPwdWindow){
		forgotPwdForm = Ext.create('Ext.form.Panel', {
			frame:true,
			forceFit:true,
			bodyStyle:'padding:5px 5px 0',
			defaultType: 'textfield',
			layout: {
				type: 'table',
				columns: 1
			},
			items: [{
				xtype:'label',
				autoScroll:true,
				cls:'desc-text',
				style:{
					marginBottom:'100px',
					marginTop:'100px'
				},
				text:'Please fill in the email address, password will be sent out after you click the \'Submit\' button.'
			},{
				xtype:'panel',
				border:false,
				bodyStyle:{"background-color":"#DFE9F6"},
				height:20
			},{
				fieldLabel: 'Email Address',
				name: 'userEmail',
				id: 'userEmail',
				vtype: 'email'
			}]
		});
		
		forgotPwdWindow = Ext.create('Ext.Window', {
			title: 'Forgot Password',
			width: 380,
			border:0,
			modal:true,
			forceFit:true,
			buttonAlign : "center",
			defaultType: 'textfield',
			defaults: {
				anchor: '100%'
			},
			items: [forgotPwdForm],
			buttons: [{
				text: "Submit",
				handler: function() {
					forgotPwdWindow.getEl().mask('Submitting...');
					Ext.Ajax.request({
						url: 'resetPwd.action',
						params: { userEmail: Ext.getCmp('userEmail').value },
						success: function(response) {
							forgotPwdWindow.getEl().unmask();
							forgotPwdWindow.hide();
							var result = Ext.util.JSON.decode(response.responseText);
							Ext.MessageBox.alert("Status", result.message);
						}
					});
				}
			},{
				text: "Cancel",
				handler: function() {
					forgotPwdWindow.hide();
				}
			}],
			closeAction: function(){
				forgotPwdWindow.hide();
			}
		});
	}	
    
	if(!login){
		login = Ext.create('Ext.form.Panel', {
			frame:true,
			id:'loginPnl',
			title: 'Login to TRP',
			bodyStyle:'padding:5px 5px 0',
			width: 350,
			buttonAlign : "center",
			defaultType: 'textfield',
			layout: {
				type: 'table',
				columns: 2
			},
			defaults: {
				anchor: '100%',
				listeners:{
					specialkey: function(field, e){
						if (e.getKey() == e.ENTER) {
							var btn = Ext.getCmp('loginPnl').getChildByElement('btnLogin',true);
							btn.handler.call(btn.scope);
						}
					}
				}
			},
			items: [{
				fieldLabel: 'Email Address',
				name: 'userid',
				id: 'userid'
			},{
				xtype:'label',
				text: '@trw.com'
			},{
				fieldLabel: 'Password',
				inputType: 'password', 
				colspan:2,
				name: 'pwd',
				id: 'pwd'
			}],
			listeners:{
				afterlayout:function(){
					Ext.getCmp('loginPnl').getComponent('userid').focus();
				}
			},
			buttons: [{
				text: 'Login',
				id:'btnLogin',
				handler:function(){
					Ext.Ajax.request({
					url: 'userLogin.action',
					params: {
						userId: Ext.getCmp('userid').value+'@trw.com',
						password: Ext.getCmp('pwd').value
					},
					success: function(response){
						var result = Ext.util.JSON.decode(response.responseText);
						if(result.state==0){
						<%if(orgUrl==null||"".equals(orgUrl)){%>
							document.location="userProfile.action";
						<%}else{%>
							document.location="<%=orgUrl%>";
						<%}%>	
						}else{
							showMessage(result.message,true);
						}
					}
				});}
			},{
				text: 'Register',
				handler:function(){
					if(!register){
						regForm = Ext.create('Ext.form.Panel', {
							frame:true,
							bodyStyle:'padding:5px 5px 0',
							width: 500,
							height: 330,
							border:0,
							forceFit:true,
							buttonAlign : "center",
							defaultType: 'textfield',
							defaults: {
								anchor: '100%',
								allowBlank: false
							},
							layout: {
								type: 'table',
								columns: 2
							},
							items: [{
								fieldLabel: 'User ID',
								name: 'userid2',
								id: 'userid2'
							},{
								xtype:'label',
								text: '@trw.com',
								style:{
									marginLeft:'0px'
								}
							},{
								fieldLabel: 'Password',
								inputType: 'password', 
								colspan:2,
								name: 'pwd2',
								id: 'pwd2',
								maxLength: 8,
								max: 8
							},{
								fieldLabel: 'Confirm Password',
								inputType: 'password', 
								name: 'cpwd2',
								id: 'cpwd2',
								maxLength: 8,
								max: 8,
								colspan:2
							},{
								fieldLabel: 'Name',
								name: 'userName',
								id: 'userName',
								colspan:2
							},{
								xtype:'menuseparator',
								height:1,
								colspan:2
							},{
								fieldLabel: 'Division',
								name: 'division',
								id: 'division',
								colspan:2
							},{
								fieldLabel: 'Department',
								name: 'department',
								id: 'department',
								colspan:2
							},{
								colspan:2,
								fieldLabel: 'Position',
								name: 'position',
								id: 'position',
								xtype:'combo',
								allowBlank:false,
								displayField: 'name',
								valueField: 'name',
								typeAhead:true,
								autoScroll:true,
								queryMode: 'local',
								store:  Ext.create('Ext.data.Store', {
									autoLoad:true,
									fields: ['name'],
									proxy: {
										type: 'ajax',
										url: 'getList.action?listId=8',
										reader: {
											type: 'json',
											root: 'itemList',
											totalProperty: 'size'
										}
									}
								})
							},{
								fieldLabel: 'Desk Tel(Dir)',
								name: 'tel',
								id: 'tel',
								colspan:2
							},{
								fieldLabel: 'Mobile',
								name: 'mobile',
								id: 'mobile',
								colspan:2
							}],
							buttons: [{
								text: 'Register',
								handler:function(){
									if(regForm.getForm().isValid()==false){
										Ext.Msg.alert('Warning', 'Please fill in all the fields!');
										return;
									}
									var pwdStr = Ext.getCmp('pwd2').value;
									var pwdStr2 = Ext.getCmp('cpwd2').value;
									if(pwdStr != pwdStr2){
										Ext.Msg.alert('Warning', 'password not match!');
										return;
									}
									Ext.Ajax.request({
										url: 'userRegister.action',
										params: {
											userId: Ext.getCmp('userid2').value+'@trw.com',
											password: Ext.getCmp('pwd2').value,
											userName: Ext.getCmp('userName').value,
											division: Ext.getCmp('division').value,
											department: Ext.getCmp('department').value,
											position: Ext.getCmp('position').value,
											tel: Ext.getCmp('tel').value,
											mobile: Ext.getCmp('mobile').value
										},
										success: function(response){
											var result = Ext.util.JSON.decode(response.responseText);
											if(result.state==0){
												register.hide();
												showMessage(result.message,false);
											}else{
												Ext.Msg.alert('Warning', result.message);
											}
										}
									});
								}
							},{
								text: 'Cancel',
								handler:function(){
									register.hide();
								}
							}]
						});
						register = Ext.create('Ext.Window', {
							title: 'Register',
							width: 510,
							height: 360,
							border:0,
							modal:true,
							buttonAlign : "center",
							defaultType: 'textfield',
							defaults: {
								anchor: '100%'
							},
							items: [regForm],
							closeAction: function(){
								register.hide();
							}
						})	
					}
					regForm.getForm().reset();
					register.show();
				}
			},{
				xtype:'label',
				html:'<a href="#" id="resetPwdId">forgot pwd?</a>'
			}],
			renderTo: 'logindiv'
		});
	}
	
	function resetPwd() {
		forgotPwdWindow.show();
	};
	Ext.get('resetPwdId').addListener('click', resetPwd);

});
</script>
</body>
</html>